<template>
    <el-drawer title="详情" :visible.sync="visible" :wrapperClosable="false" size="600px" append-to-body
        class="JNPF-common-drawer">
        <div class="JNPF-flex-main">
            <div class="dynamicForm dynamicDetail">
                <el-form ref="formRef" :model="dataForm" size="small" label-width="100px" label-position="top">
                    <template v-if="!loading">
                        <el-col :span="24">
                            <el-row :gutter="15">
                                <el-col :span="24">
                                    <jnpf-form-tip-item label="企业名称" prop="companyName">
                                        <p>{{ dataForm.companyName }}</p>
                                    </jnpf-form-tip-item>
                                </el-col>
                                <el-col :span="24">
                                    <jnpf-form-tip-item label="统一社会信用代码" prop="enterpriseCreditCode">
                                        <p>{{ dataForm.enterpriseCreditCode }}</p>
                                    </jnpf-form-tip-item>
                                </el-col>
                                <el-col :span="24">
                                    <jnpf-form-tip-item label-width="0">
                                        <div class="JNPF-common-title">
                                            <h2>产品信息</h2>
                                        </div>
                                        <el-table :data="dataForm.tableField104" size='mini'>
                                            <el-table-column type="index" width="50" label="序号" align="center" />
                                            <el-table-column prop="name" label="名称">
                                                <template slot-scope="scope">
                                                    <a @click="goProductDetail(scope.row.id)" style="color: #4b9bff">{{
        scope.row.name }}</a>
                                                </template>
                                                <!-- <template slot-scope="scope">
                                                    <p>{{ scope.row.name }}</p>
                                                </template> -->
                                            </el-table-column>
                                            <el-table-column prop="softtype" label="软件类型">
                                                <template slot-scope="scope">
                                                    <p>{{ scope.row.softtype }}</p>
                                                </template>
                                            </el-table-column>
                                            <el-table-column prop="producttype" label="产品类别">
                                                <template slot-scope="scope">
                                                    <p>{{ scope.row.producttype }}</p>
                                                </template>
                                            </el-table-column>
                                            <el-table-column prop="downloadmethod" label="下载方式">
                                                <template slot-scope="scope">
                                                    <p>{{ scope.row.downloadmethod }}</p>
                                                </template>
                                            </el-table-column>
                                            <el-table-column prop="phone" label="联系电话">
                                                <template slot-scope="scope">
                                                    <p>{{ scope.row.phone }}</p>
                                                </template>
                                            </el-table-column>
                                        </el-table>
                                    </jnpf-form-tip-item>
                                </el-col>
                            </el-row>
                        </el-col>
                    </template>
                </el-form>
            </div>
            <div class="drawer-footer">
                <el-button @click="visible = false"> 取 消</el-button>
            </div>
            <ProductDetail v-if="detailProductVisible" ref="ProductDetail" @refresh="detailProductVisible = false" />
        </div>
    </el-drawer>
</template>
<script>
import request from '@/utils/request'

import { getConfigData } from '@/api/onlineDev/visualDev'
import jnpf from '@/utils/jnpf'
import Detail from '@/views/basic/dynamicModel/list/detail'
import { thousandsFormat } from "@/components/Generator/utils/index"
import ProductDetail from './Detail_product'

export default {
    components: { Detail, ProductDetail },
    props: [],
    data() {
        return {
            visible: false,
            detailVisible: false,
            detailProductVisible: false,
            loading: false,

            dataForm: {
                id: '',
                companyName: '',
                enterpriseCreditCode: '',
                fz_saas_productList: [],
            },

            softtypeOptions: [{ "fullName": "大众免费使用", "id": "1" }, { "fullName": "购买使用", "id": "2" }],
            softtypeProps: { "label": "fullName", "value": "id" },
            producttypeOptions: [{ "children": [{ "fullName": "CAD", "id": "1-1" }, { "fullName": "CAE", "id": "1-2" }, { "fullName": "CAPP", "id": "1-3" }, { "fullName": "CAM", "id": "1-4" }, { "fullName": "数字孪生", "id": "1-5" }], "fullName": "研发制造", "id": "1" }, { "children": [{ "fullName": "PLM", "id": "2-1" }, { "fullName": "PDM", "id": "2-2" }, { "fullName": "DNC", "id": "2-3" }, { "fullName": "MDC", "id": "2-4" }, { "fullName": "QMC", "id": "2-5" }, { "fullName": "LIMS", "id": "2-6" }, { "fullName": "MES", "id": "2-7" }, { "fullName": "APS", "id": "2-8" }], "fullName": "生产制造", "id": "2" }, { "children": [{ "fullName": "ERP", "id": "3-1" }, { "fullName": "CRM", "id": "3-2" }, { "fullName": "SRM", "id": "3-3" }, { "fullName": "SCM", "id": "3-4" }, { "fullName": "OA", "id": "3-5" }, { "fullName": "BI", "id": "3-6" }, { "fullName": "FMIS", "id": "3-7" }, { "fullName": "BOM", "id": "3-8" }, { "fullName": "WMS", "id": "3-9" }, { "fullName": "MRP", "id": "3-10" }], "fullName": "经营管理", "id": "3" }, { "children": [{ "fullName": "监控系统", "id": "4-1" }, { "fullName": "日志管理系统", "id": "4-2" }, { "fullName": "故障管理系统", "id": "4-3" }, { "fullName": "安全管理系统", "id": "4-4" }], "fullName": "运维服务", "id": "4" }, { "fullName": "其他", "id": "5" }],
            producttypeProps: { "label": "fullName", "value": "id", "children": "children" },
            downloadmethodOptions: [{ "fullName": "超链接", "id": "Link" }, { "fullName": "安装包下载", "id": "Installer" }],
            downloadmethodProps: { "label": "fullName", "value": "id" },
        }
    },
    computed: {},
    watch: {},
    created() {

    },
    mounted() { },
    methods: {
        goProductDetail(id) {
            this.detailProductVisible = true
            this.$nextTick(() => {
                this.$refs.ProductDetail.init(id)
            })
        },
        toDetail(defaultValue, modelId) {
            if (!defaultValue) return
            getConfigData(modelId).then(res => {
                if (!res.data || !res.data.formData) return
                let formData = JSON.parse(res.data.formData)
                formData.popupType = 'general'
                this.detailVisible = true
                this.$nextTick(() => {
                    this.$refs.Detail.init(formData, modelId, defaultValue)
                })
            })
        },
        dataInfo(dataAll) {
            let _dataAll = dataAll
            this.dataForm = _dataAll
        },

        init(id) {
            this.dataForm.id = id || 0;
            this.visible = true;
            this.$nextTick(() => {
                if (this.dataForm.id) {
                    this.loading = true
                    request({
                        url: '/api/example/Fz_server_saas/detail/' + this.dataForm.id,
                        method: 'get'
                    }).then(res => {
                        this.dataInfo(res.data)
                        this.loading = false
                    })
                }

            })
        },
    },
}

</script>
